<!--
 * @Des: 
 * @Author: jin_yc
 * @Date: 2019-12-06 16:40:52
 * @LastEditor: jin_yc
 * @LastEditTime: 2021-12-21 18:16:12
 -->
<template>
  <fks-dialog
    width="480px"
    :visible="visible"
    @close="close"
  >
    <div slot="title">
      <i
        class="fks-icon-edit"
        :style="{ color: theme }"
      />
      {{ LANG.TASKDELEGATE }}
    </div>
    <fks-form
      ref="delegateForm"
      :model="dataInfo"
      :rules="rules"
      label-width="85px"
    >
      <fks-form-item
        :label="LANG.TASKSUBJECT"
        prop="taskSubject"
      >
        <fks-input
          v-model="taskInfo.taskSubject"
          readonly
        />
      </fks-form-item>
      <fks-form-item
        :label="LANG.TASKNAME"
        prop="taskName"
      >
        <fks-input
          v-model="taskInfo.taskName"
          readonly
        />
      </fks-form-item>
      <fks-form-item
        :label="LANG.EXECUTOR"
        prop="taskAsigneeName"
      >
        <fks-input
          v-model="taskInfo.taskAsigneeName"
          readonly
        />
      </fks-form-item>
      <fks-form-item
        :label="LANG.DELEGATOR"
        prop="userName"
      >
        <fks-user-selector
          style="width: 100%;"
          url
          :username.sync="dataInfo.userName"
          :userfullname.sync="dataInfo.userFullName"
        />
      </fks-form-item>
      <fks-form-item
        :label="LANG.DELEGATEREASON"
        prop="comment"
      >
        <fks-input
          v-model="dataInfo.comment"
          type="textarea"
        />
      </fks-form-item>
    </fks-form>
    <div slot="footer">
      <!-- <fks-button @click="close" plain type="primary">{{LANG.CANCEL}}</fks-button> -->
      <fks-button
        type="primary"
        icon="fks-icon-check"
        @click="submitDelegate"
      >
        {{ LANG.SUBMIT }}
      </fks-button>
    </div>
  </fks-dialog>
</template>

<script>
import Mix from '@/mixins/module'
import * as types from '@/store/Getter/getterTypes.js'
import { taskDelegate } from './api'
export default {
  name: 'Delegate',
  mixins: [Mix],
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    taskInfo: {
      type: Object,
      default: ()=>({
        taskId: '',
        taskName: '',
        taskSubject: '',
        taskAsigneeName: ''
      })
    }
  },
  data() {
    return {
      dataInfo: {
        userName: '',
        userFullName: '',
        comment: ''
      }
    }
  },
  computed: {
    theme() {
      return this.$store.getters[types.THEME]
    },
    rules() {
      return {
        userName: [
          { required: true, message: this.LANG.VALIDATE, trigger: 'change' }
        ],
        comment: [
          { required: true, message: this.LANG.VALIDATE, trigger: 'change' }
        ]
      }
    }
  },
  methods: {
    submitDelegate() {
      const _this = this
      this.$refs.delegateForm.validate((valid) => {
        if (valid) {
          taskDelegate(this.taskInfo.taskId, {
            comment: this.dataInfo.comment,
            userName: this.dataInfo.userName
          }).then((res) => {
            if (res.status) {
              if (this.$parent.getData) {
                this.$parent.getData()
              }
              this.$message.success(this.LANG.DELEGATE_SUCCESS)
            }
          })
          this.close()
        }
      })
    },
    close() {
      this.dataInfo.userName = ''
      this.dataInfo.userFullName = ''
      this.dataInfo.comment = ''
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style>
</style>